<template>
	<view class="container hidden" id="app" :class='reply_list.length > 0 ? "show" : "" '>
	    <view class="bg-f reply" ref="tabContent2" v-if="reply_list.length > 0">
	        <view class="type-title">评价({{ totalNum }})</view>
	        <view class="list">
	            <view class="item" v-for="(item, index) in reply_list" :key="index" v-if='item.pigcms_id'>
	                <view class="flex flex-y-center user">
	                    <view class="img-box"><img class="img" :src="item.avatar" alt=""></view>
	                    <view class="desc">
	                        <view class="name">{{ item.nickname }}</view>
	                        <view class="color-9 mt10">{{ item.add_time }}</view>
	                    </view>
	                </view>
	                <view class="flex mt10 star-wrapper">
	                    <span class="color-9">评分：</span>
	                    <view class="star-box" v-if='item.scoreArr'>
							<image class="star" src="../../static/images/star-full.png" v-for=" full in item.scoreArr[0] "></image>
							<image class="star" src="../../static/images/star-half.png" v-for=" half in item.scoreArr[1] "></image>
							<image class="star" src="../../static/images/star-empty.png" v-for=" empty in item.scoreArr[2] "></image>
	                    </view>
	                </view>
	                <view class="mt10 reply-desc">{{ item.comment }}</view>
	                <view class="mt10 color-9" v-if=' item.goods_arr.length > 0 '>
	                    <text>推荐菜：</text>
	                    <text class="goods-item" v-for=" goodsItem in item.goods_arr">{{ goodsItem }}</text>
	                </view>
	                <view class="flex flex-wrap reply-img">
	                    <view class="img-box rel" v-for='(imgItem, i) in item.pic'><img class="img" :src="imgItem" alt="" @click="previewImage(index, i)"></view>
	                </view>
	            </view>
	        </view>
	        <view class="bottom-txt" ref="bottomTxt">
	            <text class="loading" v-if="isLoading">加载更多数据</text>
	            <text class="complete" v-if="isComplete && reply_list.length > 5">没有更多数据了</text>
	        </view>
	    </view>
	</view>
</template>

<script>
	import common from '../../utils/common.js'
	var _this
	export default {
		data () {
			return {
				reply_list: [],
				showBigImgBox: false,
				store_id: 844,
				page: 1,
				pagesize: 20,
				isLoading: false,
				isComplete: false,
				isPostComplete: false,
				totalNum: 0
			}
		},
		onLoad (options) {
		    _this = this
			_this.store_id = options.store_id
			_this.totalNum = options.total
		    _this.getReplyList()
		},
		onReachBottom () {
			if (_this.isLoading && _this.isPostComplete) {
				_this.isPostComplete = false
				_this.getReplyList()
			}
		},
		methods: {
			previewImage (index, imgIndex) {
				 // 预览图片
				uni.previewImage({
					urls: _this.reply_list[index].pic,
					current: imgIndex
				});
			},
			// 获取页面信息
			getReplyList (e) {
			    var _this = this
			    var param = {
			        store_id: _this.store_id,
			        page: _this.page,
			        pagesize: _this.pagesize
			    }
			    common.post('Merchant&a=store_reply', param, function(data) {
			        _this.isPostComplete = true
			        if (data && data.length > 0) {
			            for (var i = 0; i < data.length; i++) {
			                if (data[i].score) {
			                    data[i].scoreArr = _this.scoreHandle(data[i].score)
			                }
			            }
			            _this.reply_list = _this.reply_list.concat(data)
			        }
			        if (data.length < _this.pagesize) {
			            _this.isComplete = true
			            _this.isLoading = false
			        } else {
			            _this.isLoading = true
			            _this.page++
			        }
			    })
			},
			
			// 评分处理
			scoreHandle (score) {
			    var arr = []
			    arr[0] = Math.floor(score)
			    if (score > arr[0] && score < 5) {
			        arr[1] = 1
			        arr[2] = 4 - arr[0]
			    }
			    return arr
			},
		}
	}
</script>

<style>
	@import './homePage.css'
</style>
